<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue.js测试 - 代码之美专栏</title>
    <!-- author:昌维 代码之美 https://zhuanlan.zhihu.com/codes -->
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
    <div id="app">
        <input type="text" name="" value="" placeholder="在这里输入文字，下面会跟着变化" v-model="message">
        <hr>
        <p>{{ message }}</p>
		<span v-bind:title="message1">
			鼠标悬停几秒钟查看此处动态绑定的提示信息！
		</span>
		<p v-if="seen">现在你看到我了</p>
		<ol>
			<li v-for="todo in todos">
				{{todo.text}}
			</li>
		</ol>
    </div>
    <script type="text/javascript">
        var app = new Vue({
          el: '#app',
          data: {
            message: 'Hello Vue!',
			message1: '页面加载于' + new Date().toLocaleString(),
			seen: true,
			todos: [{
				text: '学习java'
			},{
				text: '学习js'
			},{
				text: '学习vue'
			}]
          }
        })
    </script>
</body>
</html>